<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>

    
    <title>My JSP 'create2.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<link type="text/css" rel="stylesheet" href="${ctx}/css/themes/default/easyui.css">
		<link type="text/css" rel="stylesheet" href="${ctx}/css/themes/icon.css">
		<script type="text/javascript"
			src="${ctx}/scripts/jquery-1.4.2.min.js"></script>
		<script type="text/javascript"
			src="${ctx}/scripts/jquery.easyui.min.js"></script>
		<script type="text/javascript"
			src="${ctx}/scripts/locale/easyui-lang-zh_CN.js"></script>
		<script type="text/javascript"
			src="${ctx}/scripts/jquery-1.4.4.min.js"></script>
		<script type="text/javascript"
			src="${ctx}/commons/upload/js/swfobject.js"></script>
		<script type="text/javascript"
			src="${ctx}/commons/upload/js/jquery.uploadify.v2.1.4.js"></script>
		<script type="text/javascript"
			src="${ctx}/scripts/jquery.ztree.core-3.0.min.js"></script>
		<script type="text/javascript"
			src="${ctx}/scripts/jquery.ztree.excheck-3.0.min.js"></script>
<script>
 // 设置偶数行和奇数行的颜色
 $(document).ready(function(){
   $("tbody>tr:odd").addClass("ou");
   $("tbody>tr:even").addClass("ji");
   
   $("tbody>tr:has(:checked)").addClass("ed");
   
   // 搜索被选中 has (:checked)
   $("tbody>tr").click(function(){
   
      var hased = $(this).hasClass('ed');
      if (hased){
       $(this).removeClass("ed").find(":input").attr("checked",false);
      }else{
       $(this).addClass("ed").find(":input").attr("checked",true);
      }
      
      // 选中框  
   });
   
   // 获取所有选中框的值
   $("#tj").click(function(){
        var str="";
           $("input[type='checkbox']:checked").each(function(){
          str+=$(this).val()+"\r\n";
        })
        alert(str);
   });
   
 });
</script>
<style type="text/css">
.ou {background:#fff;}
.ji {background:#fac;}
.ed {background:#abc;}
</style>
</head>

<body>
<p style="display:none;">
addClass()方法向被选元素添加一个或多个类 <br />
$(selector).addClass(class)<br />

removeClass方法从被选元素移除一个或多个类<br />
$(selector).removeClass(class)<br />

hasClass()方法检查被选元素是否包含制定的class<br />
$(selector).hasClass(class)<br />

find()再次定位或查找指定元素<br />
.find(class)<br />

$(selector).attr(attribute)<br />
$(selector).attr(attribute,value)<br />
$(selector).attr(attribute,function(index,oldvalue))<br />

补充:冒号，在jquery用法 <br />
:在css中代表伪选择符，但是在jquery，这里是固定的用法<br />

：input :text :password :radio :checkbox :submit :image :reset :button :file :hidden<br />
:first :last :not :even :odd :eq :gt :lt :header :animated<br />
:contains :empty :has :parent :hidden :visible<br />
</p>

<div id="my_test">
<form name="myform" method="post" action="">
  <table width="500" height="160" border="0">
    <tr>
      <th></th>
      <th>标题</th>
      <th>时间</th>
      <th>地点</th>
    </tr>
    <tr>
      <td><input type="checkbox" name="choice[]" value="1"  /></td>
      <td>标题1</td>
      <td>2011</td>
      <td>北京1</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="choice[]" value="2"  /></td>
      <td>标题2</td>
      <td>2012</td>
      <td>北京2</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="choice[]" value="3"  /></td>
      <td>标题3</td>
      <td>2012</td>
      <td>北京3</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="choice[]" value="4"  /></td>
      <td>标题4</td>
      <td>2013</td>
      <td>北京4</td>
    </tr>
  </table>
  <input type="button" id="tj" value="提 交" />
  </form>
</div>
</body>
</html>